<%@page contentType="text/html; charset=UTF-8" language="java"%>
<%@include file="common/tag.jsp"%>
<!DOCTYPE html>
<html>
	<head>
		<title>库存商品列表</title>
		<%@include file="common/head.jsp"%>
		<link rel="stylesheet" href="${pageContext.request.contextPath }/resource/css/commodity.css"></head>
		<body>
			<div class="container">
				<div class="panel panel-default">
					<div class="panel-heading text-center">
						<h2>商品列表</h2>
					</div>
					<div class="panel-body">
						<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">添加商品</button>
						<table class="table table-hover">
							<input size="16" type="text" value="2012-06-15 14:45" readonly class="form_datetime"></table>
							<div class="col-sm-offset-4">
								<nav>
									<ul class="pagination">
										<li>
											<a>当前
												<span id="currentPage1"></span>/
												<span id="totalPage1"></span>页
											</a>
										</li>
										<input type="hidden" id="temp">
											<li>
												<a onclick="goPage('first')">首页</a>
											</li>
											<li>
												<a onclick="goPage('prev')">上一页</a>
											</li>
											<li>
												<a onclick="goPage('next')">下一页</a>
											</li>
											<li>
												<a onclick="goPage('final')">末页</a>
											</li>
										</ul>
									</nav>
								</div>
							</div>
						</div>
					</div>
					<form id="myForm" name="myForm">
						<div class="modal fade bs-example-modal-sm" id="myModal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
							<div class="modal-dialog modal-sm">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal" aria-label="Close">
											<span aria-hidden="true">&times;</span>
										</button>
										<h4 class="modal-title" id="myModalLabel">添加商品</h4>
									</div>
									<div class="modal-body">
										<div class="row">
											<div class="col-sm-offset-3">
												<img src="" class="img-circle" id="image"/>
											</div>
										</div>
										<div class="row">
											<div class="col-sm-offset-1 col-sm-5">
												<a class="file">
													选择图片
													<input type="file" id="picture" name="picture"/>
												</a>
											</div>
											<div class="col-sm-4">
												<span class="showFileName label label-info"></span>
												<span class="fileerrorTip label label-danger"></span>
											</div>
										</div>
										<div class="row">
											<div class="col-sm-offset-1 col-sm-9">
												<input type="text" class="form-control input" id="commodityName" name="commodityName" placeholder="商品名称："></div>
											</div>
											<div class="row">
												<div class="col-sm-offset-1  col-sm-9">
													<input type="text" class="form-control input" id="number" name="number" placeholder="商品数量：单位(个)"></div>
												</div>
												<div class="row">
													<div class="col-sm-offset-1  col-sm-9">
														<input type="text" class="form-control input" id="price" name="price" placeholder="商品价格：单位(元)"></div>
													</div>
												</br>
												<div class="row">
													<div class="col-sm-offset-1 col-sm-9">
														<textarea class="form-control input" rows="6" cols="28" placeholder=" 商品描述：" id="description" name="description"></textarea>
													</div>
												</div>
											</br>
											<div class="row">
												<div class="col-sm-offset-1 col-sm-9">
													<span class="errorTip label label-danger"></span>
													<span class="successTip label label-info"></span>
												</div>
											</div>
										</div>
										<div class="modal-footer">
											<button type="reset" class="btn btn-primary"  id="rest">重置</button>
											<button type="button" class="btn btn-primary" id="addCommodity">添加</button>
										</div>
									</div>
								</div>
							</div>
						</div>
					</from>
				</div>
			</div>
		</body>
		<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
		<script src="http://apps.bdimg.com/libs/jquery/2.0.0/jquery.min.js"></script>
		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
		<script src="http://apps.bdimg.com/libs/bootstrap/3.3.0/js/bootstrap.min.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/resource/datetimepicker/js/bootstrap-datetimepicker.js" charset="UTF-8"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/resource/datetimepicker/js/locales/bootstrap-datetimepicker.fr.js" charset="UTF-8"></script>
		<script src="${pageContext.request.contextPath }/resource/script/commoditylist.js" type="text/javascript"></script>
		<script type="text/javascript">
			$(function () {
				commoditylist.commodity.init({bathPath: '${pageContext.request.contextPath}'});
			});
		</script>

	</html>
